---
layout: default
---
<style>
    .crumbs {
        border-bottom: 1px solid black;
        margin-top: 4px;
        margin-bottom: 8px;
    }
    .crumbs ol {
        list-style-type: none;
        padding-left: 0;
    }

    .crumbs ol li {
        display: inline-block;
    }

    .crumb::after {
        display: inline-block;
        color: #000;
        content: '>';
        font-size: 80%;
        font-weight: bold;
        padding: 0 3px;
    }
    .chapter .title {
        text-align: center;
        font-size: 24px;
        font-weight: bolder;
        height: 2em;
        line-height: 2em;
        border-bottom: 2px double skyblue;
    }
    .work-area article {
        counter-set: Level1 {{ page.section | minus: 1 }};
    }

    .introduction {
        margin-top: 2em;
    }
    .introduction > div {
        width: 60%;
        float: left;
    }

    .TOC {
        counter-reset: toc_chapter;
        list-style: none;
        float: left;
        padding-left: 2em;
        border-left: 2px double whitesmoke;
        margin-top: 0.5rem;
    }
    .TOC > li {
        counter-increment: toc_chapter;
        font-size: 16px;
    }
    .TOC > li > ul {
        counter-reset: toc_section;
        list-style: none;
        text-indent: 1em;
    }
    .TOC > li > ul > li {
        counter-increment: toc_section;
        font-size: 12px;
    }
    .TOC > li::before {
        content: counter(toc_chapter)" ";
    }
    .TOC > li li::before {
        content: counter(toc_chapter)"."counter(toc_section)" ";
    }
</style>
<nav class="crumbs">
    <ol>
        <li class="crumb">{{page.series}}</li>
        <li>{{page.course}}</li>
    </ol>
</nav>
<article class="chapter">
    <div class="title">{{page.title}}</div>
    {{content}}
</article>